<?=view('header.html')?>
<div class="right-content">
  <div class="layui-content">
    <div class="layui-row">
      <div class="layui-card">

        <div class="layui-card-header  mokui-card-header-form">
          <form class="layui-form" id="search" lay-filter="formSearch">

            <div class="layui-form-item">
              <div class="layui-inline">
                <div class="layui-form-mid">用户名:</div>
                <div class="layui-input-inline">
                  <input type="text" name="username" autocomplete="off" class="layui-input">
                </div>
              </div>

              <div class="layui-inline">
                <div class="layui-form-mid">邮箱:</div>
                <div class="layui-input-inline">
                  <input type="text" name="email" autocomplete="off" class="layui-input">
                </div>
              </div>

              <div class="layui-inline">
                <button type="button" class="layui-btn layui-btn-blue" lay-submit lay-filter="mokSearch">搜索</button>
                <button type="reset" class="layui-btn layui-btn-primary" lay-submit lay-filter="mokSearchReset">重置</button>
              </div>

            </div>

          </form>
        </div>

        <div class="layui-card-body">

          <table id="listTable" lay-filter="listTable"></table>

          <script type="text/html" id="toolbarOption">
            <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="delAll">删除</a>
            <a class="layui-btn layui-btn-sm" lay-event="add">添加会员</a>
          </script>

          <script type="text/html" id="barOption">
            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-blue layui-btn-xs" lay-event="login">登录</a>
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
          </script>

        </div>
      </div>
    </div>
  </div>
</div>
<?=view('statics.html')?>
<script type="text/javascript">

  layui.use(['layer', 'form', 'jquery', 'table', 'laydate'], function () {
    var layer = layui.layer,
      $ = layui.jquery,
      form = layui.form,
      table = layui.table,
      laydate = layui.laydate;


    //列表
    window.tableInit = table.render({
      elem: '#listTable',
      toolbar: "#toolbarOption",
      title: '支付列表',
      url: adminpath + "admin/user/oauth",
      method: 'post',
      cols: [
        [
          { type: 'checkbox' },
          { type: 'checkbox' },
          { field: 'id', title: 'ID', width: 80, sort: true },
          { field: 'username', title: '用户名' },
          { field: 'nickname', title: '昵称' },
          { field: 'groupname', title: '会员组' },
          { field: 'email', title: '邮箱' },
          { field: 'phone', title: '手机号' },
          { field: 'regtime_date', title: '注册时间' },
          { fixed: 'right', title: '操作', toolbar: '#barOption' }
        ]
      ],
      page: {
        layout: ['prev', 'page', 'next', 'count'],
        groups: 5,
        first: true,
        last: true
      },
      response: {
        statusCode: 0,
        countName: 'count'
      },
      parseData: function (res) {
        return {
          'code': res.code,
          "data": res.data.data,
          'count': res.data.total
        };
      }
    });



    //查询提交
    form.on('submit(mokSearch)', function (data) {
      console.log(data);
      tableInit.reload({
        where: data.field
        , page: {
          curr: 1
        }
      });

    });

    //重置search_reset
    form.on('submit(mokSearchReset)', function (data) {
      $('#search')[0].reset();
      form.render(null, 'formSearch');
      var field = data.field;
      $.each(field, function (k, v) {
        field[k] = '';
      });
      tableInit.reload({
        where: data.field
        , page: {
          curr: 1
        }
      });
    });

    //头工具栏事件
    table.on('toolbar(listTable)', function (obj) {
      var checkStatus = table.checkStatus(obj.config.id);
      switch (obj.event) {

        case 'delAll':
          var data = checkStatus.data;
          var ids = [];
          data.forEach(function (n, i) {
            ids.push(n.id);
          });

          var url = adminpath + 'admin/user/del';
          var title = '确定要删除吗？';

          if (ids != '') {

            layer.confirm(title, { icon: 3, title: '操作提示' }, function (index) {
              $.post(url, { ids: ids }, function (res) {
                if (res.code == 0) {
                  layer.msg('操作成功， 正在刷新...', {
                    time: 1500, end: function () {
                      tableInit.reload();
                      // location.reload();
                    }
                  });
                } else {
                  layer.msg(res.msg);
                }
              }, 'json')
              layer.close(index);
            });

          } else {
            layer.msg('请选择要操作的数据', { icon: 5, anim: 6 });
            return false;
          }
          break;

        case 'add':
          var url = adminpath + 'admin/user/add';
          var title = '添加用户';
          layer.open({
            title: title,
            type: 2,
            area: ['600px', '80%'],
            anim: 2,
            shadeClose: false,
            // skin: 'layui-layer-molv',
            content: url
          });
          break;

      };
    });

    //监听行工具事件
    table.on('tool(listTable)', function (obj) {
      var data = obj.data;
      if (obj.event === 'del') {
        if (data.id != '') {
          layer.confirm('确定要删除吗？', { icon: 3, title: '消息提示' }, function (index) {
            $.post(adminpath + 'admin/user/del', { ids: data.id }, function (res) {
              if (res.code == 0) {
                layer.msg('操作成功， 正在刷新...', {
                  time: 1500, end: function () {
                    tableInit.reload();
                  }
                });
              } else {
                layer.msg(res.msg);
              }
            }, 'json')
            layer.close(index);
          });

        } else {
          layer.msg('请选择要操作的数据', { icon: 5, anim: 6 });
          return false;
        }

      } else if (obj.event === 'edit') {
        var url = adminpath + 'admin/user/edit?id=' + data.id;
        var title = '编辑用户';
        layer.open({
          title: title,
          type: 2,
          area: ['600px', '80%'],
          anim: 2,
          shadeClose: false,
          skin: 'layui-layer-molv',
          content: url
        });
      } else if (obj.event === 'login') {

        var url = adminpath + 'admin/user/loginUser?id=' + data.id;
        var title = '登录前台用户';
        layer.confirm('确定登录此用户账号吗？', { icon: 3, title: '消息提示' }, function (index) {
          window.open(url);
          layer.close(index);
        });

      }


    });


    //搜索条件
    form.on('submit(ams_reset)', function (data) {
      $("#searchForm")[0].reset();
      form.render();
      $('#ams_search').trigger('click');
    });

    //标题搜索
    form.on('submit(ams_search)', function (data) {
      // console.log(data.field);return;
      tableInit.reload({
        where: data.field
        , page: {
          curr: 1
        }
      });
    });



  });

</script>

</body>

</html>